﻿<!DOCTYPE html>
<html>
<head>
    <title>所有链接</title>
    $css()
    $iconcss()
    <style type="text/css">
        .ui-autocompletion-panel{ border: solid 1px #ddd;border-top: 0px;color:#000000}
        .ui-autocompletion-panel .inner{ padding: 0px;}
        .ui-autocompletion-panel ul li {padding: 5px 10px; }
        .ui-autocompletion-panel ul li.first { border:none}
        .ui-autocompletion-panel ul li.selected {
            background: #f0f0f0;
        }
        .ui-autocompletion-panel ul li b{ color: green;}
    </style>
</head>
<body>
    <div class="tabarea">
        <div class="tab_mini">
            <a class="current" href="javascript:;">关联链接</a>
        </div>
        <div class="overhidden" id="relatedPanel">
            <table cellpadding="0" cellspacing="0" width="100%" height="100%">
                <tr>
                    <td width="350" valign="top">
                        <div id="dg" class="control"></div>
                        <div class="ui-table-meta" id="pager"></div>
                    </td>
                    <td valign="top">
                        <div id="pl" class="relative autoHeight autoScroll"></div>
                    </td>
                </tr>
            </table>
        </div>
    </div>

    <script type="text/template" id="link_form">
            <div class="form autostyle">
                <div class="entityForm">
                    <dl>
                        <dt>链接内容：</dt>
                        <dd><input type="text" class="tb_normal archiveGuest"/><br/>
                        输入搜索内容后，在搜索结果中选择</dd>
                    </dl>

                    ${form}
                    <dl>
                        <dt>&nbsp;</dt>
                        <dd>
                            <a onclick="saveLink()" class="btn" href="javascript:;">{btntext}</a>
                        </dd>
                    </dl>
                </div>
            </div>
        </script>

        <script type="text/template" id="tpl">
            <div class="item" onclick="menu.add()">
                <a href="javascript:;">$icon(create)新建</a>
            </div>
   
            <div class="item" onclick="menu.del('%id%')">
                <a href="javascript:;">$icon(delete)删除</a>
            </div>
            <div class="item" onclick="menu.refresh()">
                <a href="javascript:;">$icon(refresh)刷新</a>
            </div>
        </script>$js()
    <script type="text/javascript">
        
        var dataCollection = null;
        var pl = cms.$('pl');

        cms.dom.fitHeight(cms.$('relatedPanel').parentNode);
        cms.dom.fitHeight(cms.$('relatedPanel'));

        var form_tpl = cms.$('link_form').innerHTML;

        

        window.saveData = window.saveLink = function () {
            if (cms.validator.validate('pl')) {
                var data = cms.json.toObject('pl');
                data.contentId = cms.request('contentId');
                data.typeIndent = cms.request('type');
                cms.xhr.jsonPost('?module=link&action=saveReleatedLink', data, function (json) {
                    if (json.result) {
                        _dg.reload();
                    }
                    parent.parent.M.alert(json.message);
                });
            }
        };

        var _dg = cms.grid('dg', {
            url: '?module=link&action=relatedlink',
            data: {
                contentId: cms.request('contentId'),
                typeIndent: cms.request('type')
            },
            idField: 'LinkId',
            columns: [
                //{ field: 'ID', title: '编号', width: 100, formatter: null},
                { field: 'LinkName', title: '名称', width: 80, formatter: null },
                { field: 'LinkTitle', title: '标题', width: 120, formatter: null },
                { field: 'LinkUri', title: '链接地址', formatter: null }
            ],
            loaded: function (data) {

                dataCollection = data.rows;

                var tables = document.getElementsByTagName('TABLE');

                var tds = tables[2].getElementsByTagName('TD');

                var allowMultSelect = false;

                J.table.dynamic(tables[2], allowMultSelect, function (trs) {
                    var id = trs[0].getAttribute('data-indent');
                    pl.innerHTML = cms.template(form_tpl, { btntext: '保存' });
                    pl.getElementsByTagName('DL')[0].style.display = 'none';
                    for (var i = 0; i < dataCollection.length; i++) {
                        if (dataCollection[i].LinkId == id) {
                            cms.json.bind(pl, {
                                LinkId: id,
                                LinkName: dataCollection[i].LinkName,
                                LinkUri: dataCollection[i].LinkUri,
                                LinkTitle: dataCollection[i].LinkTitle,
                                Enabled: dataCollection[i] ? 'True' : 'False'
                            });
                        }
                    }

                    //
                });

                cms.each(tds, function (i, e) {
                    cms.contextmenu.bind(e, null, function (menu) {
                        menu.innerHTML = cms.template(cms.$('tpl').innerHTML, {
                            id: e.parentNode.getAttribute('data-indent')
                        });
                    });
                });


                //加载分页
                this.panel.nextSibling.innerHTML = data.pager;

            }
        });


        var menu = {
            add: function() {
                cms.$('pl').innerHTML = cms.template(form_tpl, { btntext: '新增' });
                cms.json.bind('pl', { Enabled: 'True' });

                $JS.each($JS.getElementsByClassName($JS.$('pl'), 'archiveGuest'), function (i, e) {
                    $JS.autoCompletion(e, '?module=ajax&action=GetSearchArchivesJsonResult&size=5', function (data) {
                        for (var j = 0; j < data.length; j++) {
                            data[j].text = data[j].title;
                            data[j].title = '栏目：'+ data[j].category;
                        }
                    }, function (data) {
                        cms.json.bind('pl', {
                            LinkUri: data.id,
                            LinkTitle: data.text,
                            Enabled: 'True'
                        });
                    });
                });
            },
            del: function (id) {
                if (confirm('确定删除吗?删除后将不可恢复!')) {
                    var data = {
                        id: id,
                        contentId: cms.request('contentId'),
                        typeIndent: cms.request('type')
                    };
                    cms.xhr.jsonPost('?module=link&action=deleterelatedlink', data,
                        function (json) {
                            if (json.result) {
                                _dg.reload();
                            } else { parent.M.alert(json.message); }
                        });
                }
            },
            refresh: function () {
                _dg.reload();
            }
        };

        menu.add();
         
    </script>

</body>
</html>
